<template>
	<view>
		<u-navbar :borderBottom="false" back-text=" " :title="title"></u-navbar>
		<view class="sthconnect">
			<view class="sthconnectInfo">
				<view class="info_item">
					<span>
						<span class="xing">*</span>
						<span class="info_item_title">代购链接</span>
					</span>
						
					<div class="info_item_right">
						<input placeholder-class="input"  :disabled="form.status>1" v-model="form.link" class="input" type="text" placeholder="若没有请备注：需客服查询" />
					</div>
					
				</view>
				<view class="info_item">
					<span>
						<span class="xing">*</span>
						<span class="info_item_title">购买平台</span>
					</span>
					
					<div class="info_item_right">
						<input maxlength="20" placeholder-class="input" :disabled="form.status>1" class="input" v-model="form.platform" type="text" placeholder="请输入购买平台" />
					</div>
					
				</view>
				<view class="info_item">
					<span>
						<span class="xing">*</span>
						<span class="info_item_title" >物品名称</span>
					</span>
					
					<div class="info_item_right">
						<input maxlength="20" placeholder-class="input" :disabled="form.status>1" class="input" type="text" v-model="form.name" placeholder="请输入物品名称" />
					</div>
					
				</view>
				<view class="info_item">
					<span>
						<span class="xing">*</span>
						<span class="info_item_title" >联系方式(微信)</span>
					</span>
					
					<div class="info_item_right">
						<input maxlength="30" placeholder-class="input" :disabled="form.status>1" class="input" type="text" v-model="form.style" placeholder="请输入微信账号" />
					</div>
					
				</view>
				<view class="info_item">
					<span>
						<span class="xing">*</span>
						<span class="info_item_title">数量</span>
					</span>
					
					<div class="info_item_right">
						<input maxlength="8" placeholder-class="input" :disabled="form.status>1" class="input" type="number"  v-model="form.num" placeholder="请输入代购数量" />
					</div>
					
				</view>
				<view class="info_item" style="border: none;">
					<span>
						<span class="xing"></span>
						<span class="info_item_title">备注</span>
					</span>
					<div class="info_item_right">
					</div>
				</view>
				<textarea placeholder-class="input"  :disabled="form.status>1" class="textarea" maxlength="150" v-model="form.remark" placeholder="请输入备注" id="" cols="30" rows="5"></textarea>
				<view v-if="order_id" class="info_item" style="border: none;">
					<span>
						<span class="xing"></span>
						<span class="info_item_title">平台备注</span>
					</span>
					<div class="info_item_right">
					</div>
				</view>
				<textarea v-if="order_id" placeholder-class="input"  :disabled="true" class="textarea" maxlength="150" v-model="form.customer_remark" placeholder="请输入备注" id="" cols="30" rows="5"></textarea>
			</view>
		</view>
		<view class="imgs">
			<view class="upimg_title">
				<span class="xing">*</span>
				上传物品照片
				<!-- <span class="title_small">(链接与照片可选其中一个上传)</span> -->
			</view>
		</view>
		<view class="" style="padding: 0rpx 0 32rpx 32rpx;">
			<upload :imag-list="imgList" :disable='form.status>1' @imageChange="FileChange"></upload>
		</view>
		<view v-if="order_id" class="imgs">
			<view class="upimg_title">
				平台返图
			</view>
		</view>
		<view v-if="order_id" class="" style="padding: 32rpx; display: flex; flex-wrap: wrap;">
			<u-image @click="previewImage(index , report_list)" v-for="(item,index) in report_list" :key="index" width="150rpx" height="150rpx" style="margin-right: 15rpx;" border-radius="15" :src="item"></u-image>
		</view>
		<view v-if="form.status<2" class="" style="width: 100%;height: 200rpx;">
			
		</view>
		<view v-if="form.status<2" class="button_submit">
			<u-button v-if="order_id " @click="onSubmit(2)" class="btns" :custom-style="{'background':'#90c0ff' ,color:'#fff'}"  :shape="'circle'" :hair-line="false" :ripple="true" ripple-bg-color="rgba(9, 82, 200, 0.15)">
				修改
			</u-button>
			<u-button v-else @click="onSubmit(1)" class="btns" :custom-style="{'background':'#90c0ff' ,color:'#fff'}"  :shape="'circle'" :hair-line="false" :ripple="true" ripple-bg-color="rgba(9, 82, 200, 0.15)">
				提交审核
			</u-button>
		</view>
	</view>
</template>

<script>
	import upload from '@/componts/upload/upload.vue';
	export default {
		components:{
		    upload
		},
		data() {
			return {
				title:'申请代拍',
				pop_show:false,
				type_text:'请选择寄往仓库',
				imgList:[],
				report_list:[],
				order_id:null,
				form:{
					"type2": "1", //1 代买 2代付
					"link": null,
					'style':null,//物品款式
					"name": null, //物品名
					'platform':null,//购买平台
					"num": null, //数量
					"remark": null, //备注信息
					status:0,
					"pic": null, //图片
				}
			}
		},
		onLoad(e) {
			if(e.order_id){
				// console.log('--------')
				this.order_id = e.order_id
				this.getInfo()
			}
		},
		onShow() {
			var token = uni.getStorageSync('token')
			if(!token){
				uni.setStorageSync('isModule' , true)
				uni.showModal({
					title: '登录',
					content: '登录后可使用完整功能',
					cancelText: "取消", // 取消按钮的文字  
					confirmText: "确认", // 确认按钮的文字  
					showCancel: true, // 是否显示取消按钮，默认为 true
					success: (res) => {
						uni.setStorageSync('isModule' , false)
					if(res.confirm) {  
						// console.log('comfirm') //点击确定之后执行的代码
						uni.navigateTo({
							url:'/pages/login/login'
						})
					} else {  
						
						uni.switchTab({
							url:'/pages/index/index'
						})
						}  
					} 
				})
				return
			}
		},
		methods: {
			// 预览图片
			previewImage(index , arr) {
			  uni.previewImage({
			    current: index, // 当前显示图片索引
			    urls: arr // 需要预览的图片http链接列表
			  });
			},
			getInfo(){
				var data = {
					id:this.order_id
				}
				this.$wqzApi.buy_detail(data).then(res=>{
					this.form = res.data
					if( res.data.pic!=''){
						this.imgList = res.data.pic.split(',')
					}
					if( res.data.report_pic!=''){
						this.report_list = res.data.report_pic.split(',')
						// console.log(this.report_list , '---1212----')
					}
					this.type_text = res.data.type==1?'韩国仓库':'日本仓库'
				})
			},
			openPop(){
				if(this.form.status>1){
					return
				}
				this.pop_show = true
			},
			onchange(e){
				this.type_text = this.list[e].text
				this.form.type = this.list[e].type
			},
			FileChange(e){
				this.imgList = e
			},
			dignyu(){
				return new Promise((resolve, reject) => {
					wx.requestSubscribeMessage({
					    tmplIds: [
							'LL09Z07c3pLTnLQotLfD8DYQm9SB6A-QQ1QW3eBop2M',//支付消息提醒
							'bjb55ZIOo1z7CjLTXkkqVSd_fe6WJLaqIjxtmihuZTI', //物流消息提醒
						],
					    success(res) {
							resolve(true)
					    },
						fail(err) {
							resolve(false)
						}
					})
				})
			},
			onSubmit(type){
				var isOk = true
				var toast = ''
				this.form.pic = this.imgList.join(',')
				// console.log(this.form)
				try{
					for(var key in this.form){
						if(!this.form[key]){
							if(key=='link'){
								toast="请输入代购链接"
								throw new Error(toast)
							} 
							if(key=='platform'){
								toast="请输入购买平台"
								throw new Error(toast)
							} 
							if(key=='name'){
								toast="请输入物品名称"
								throw new Error(toast)
							} 
							if(key=='num'){
								toast="请输入购买数量"
								throw new Error(toast)
							} 
							if(key=='style'){
								toast="请输入联系方式"
								throw new Error(toast)
							}
							if(key=='pic'){
								toast="请上传物品照片"
								throw new Error(toast)
							} 
						}
					}
				}catch(err){
					isOk = false
				}
				
				// if(this.form.link || this.form.pic){
					
				// }else{
				// 	isOk = false
				// 	toast = '请填写链接或上传物品照片'
				// }
				
				if(!isOk){
					uni.showToast({
						title:toast,
						icon:'none'
					})
					return
				}
				
				if(type==1){
					// 新增
					this.$wqzApi.Buy_add(this.form).then(res=>{
						uni.showToast({
							title:'提交成功',
							icon:'none'
						})
						setTimeout(()=>{
							uni.redirectTo({
								url:'/pages/order_other_list/order_other_list?current=0&type=1'
							})
						},1500)
					})
				}else{
					// 修改
					this.$wqzApi.buy_update(this.form).then(res=>{
						uni.showToast({	
							title:'提交成功',
							icon:'none'
						})
						setTimeout(()=>{
							uni.redirectTo({
								url:'/pages/order_other_list/order_other_list?current=0&type=1'
							})
						},1500)
					})
				}
				// this.dignyu().then(res=>{
				// 	if(type==1){
				// 		// 新增
				// 		this.$wqzApi.Buy_add(this.form).then(res=>{
				// 			uni.showToast({
				// 				title:'提交成功',
				// 				icon:'none'
				// 			})
				// 			setTimeout(()=>{
				// 				uni.redirectTo({
				// 					url:'/pages/order_other_list/order_other_list?current=0&type=1'
				// 				})
				// 			},1500)
				// 		})
				// 	}else{
				// 		// 修改
				// 		this.$wqzApi.buy_update(this.form).then(res=>{
				// 			uni.showToast({	
				// 				title:'提交成功',
				// 				icon:'none'
				// 			})
				// 			setTimeout(()=>{
				// 				uni.redirectTo({
				// 					url:'/pages/order_other_list/order_other_list?current=0&type=1'
				// 				})
				// 			},1500)
				// 		})
				// 	}
				// })
				
				
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import url(./index.scss)
</style>
